@charset "utf-8";
/******************************************************

 概况：样式表入口文件
 
 ******************************************************/

/* 全局 */
@import 'main.css';

@import 'header_topic.css';

.banner{margin: 0 auto; width:100%; height: 900px; background: url(../images/topic/hotspring/banner.jpg) no-repeat center; position: relative;}
.banner .hs_place{overflow: hidden; position: absolute; top: 580px; left: 50%; margin:0 -100px;}
.banner .hs_place li{display:inline-block;margin-right: 100px;}

.rec{width: 1224px; margin: 0 auto;}
.rec .rec_tittle{ margin: 20px 0 50px 0;}
.rec .rec_wrap{overflow: hidden; margin: 0 -3px 30px -3px;}
.rec .rec_wrap .rec_img{width: 199px; height: 195px; margin: 3px; float: left; overflow:hidden;}
.rec .rec_wrap .rec_img img{ transition: all 0.5s linear; width: 199px; height: 195px;}
.rec .rec_wrap .rec_img1{width: 199px; height: 195px; margin: 3px; float: left; background: url(../images/topic/hotspring/rec_bg.jpg); padding: 20px 10px; box-sizing:  border-box;}
.rec .rec_wrap .rec_img1 a{display: block; height: 100%;}
.rec .rec_wrap .rec_img1 p{color: white; font-size: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 28px; font-weight: 600; font-style: italic;}
.rec .rec_wrap .hang{padding-left: 205px; overflow: hidden;}
.rec .rec_wrap .hang .rec_text{ padding: 20px 0 0 50px; float: left;}
.rec .rec_wrap .hang .rec_text p{font-size: 24px; font-style: italic; color: #a09fa0; line-height: 46px;}
.rec .rec_wrap .hang .rec_text p:after{content: ""; width: 200px; height: 2px; background: url(../images/topic/hotspring/rec_icon.jpg) no-repeat; display: inline-block; margin: 0 0 7px 20px;}
.rec .rec_wrap .rec_img:hover img{transform:scale(1.1);}


.main_bg{width: 100%; height: 2270px; background:url(../images/topic/hotspring/main_bg.jpg) no-repeat center; margin: 0 auto;}
.main{width: 1130px; margin: 0 auto;}

.main .wrap1:after{content: ""; display: block; clear: both;}
.main .wrap1 li{float: left; margin-top: 290px; width: 300px;}
.main .wrap1 li:nth-child(2){width: 310px; margin: 200px 110px 0 110px;}
.main .wrap1 li h3{text-align: center; font-size: 30px; color: #fe568e; margin-bottom:20px ;}
.main .wrap1 li h3 span{ font-size: 30px; color: #fe568e; font-weight: bold;}
.main .wrap1 li a img{width: 300px; height: 392px; border-radius: 20px;}
.main .wrap1 li a h4{ font-size: 16px; color: #886115; margin: 5px 15px 0 15px; font-weight: 600;}
.main .wrap1 li:hover img{box-shadow: 0 3px 10px 3px rgba(0,0,0,0.2);}

.main .wrap2{ margin-top: 200px;}
.main .wrap2 h2{ margin-bottom:50px; padding-top: 45px; text-align: center; font-size: 50px; color: #6b988e;}
.main .wrap2 .box{ margin: 0 -9px;}
.main .box:after{content: ""; clear: both; display: block;}
.main .wrap2 .box li{float: left; width: 360px; margin: 9px; background-color: #f7f7f7;}
.main .wrap2 .box li img{width: 360px; height: 210px;}
.main .wrap2 .box li h3{height: 60px;overflow: hidden; text-overflow: ellipsis; margin: 0 5px; font-size: 20px;}
.main .wrap2 .box li p{font-size: 15px; color: #333333; margin-left: 10px;}
.main .wrap2 .box li p span{font-size: 30px; color: #279317;}
.main .wrap2 .box li p span:before{content: "￥"; font-size: 18px;}
.main .wrap2 .box li p s{text-decoration:line-through; color: #A09FA0; margin-left: 20px;}
.main .wrap2 .box li .btn{background-color: #ff692c; text-align: center; color: #FFFFFF; width: 332px; height: 40px; line-height: 40px; margin: 3px auto 15px; font-size: 22px; font-weight: 600;}
.main .wrap2 .box li:hover{box-shadow: 0 3px 10px 3px rgba(0,0,0,0.2);}

.main .wrap3{ margin-top: 190px; padding-bottom: 200px;}
.main .wrap3 h2{font-size: 40px; color: #ff6699; text-align: center; font-weight: bold; line-height:50px;}
.main .wrap3 h3{color: #FF6699; text-align: center;font-size: 18px; font-family: simsun; letter-spacing: 5px; line-height:30px; margin-bottom: 40px;}
.main .wrap3 .box{margin: 0 -6px}
.main .wrap3 .box li{float: left;width: 273px; margin: 6px; background-color: #f7f7f7; padding-bottom: 15px; position: relative;}
.main .wrap3 .box li a img{width: 273px; height: 206px;}
.main .wrap3 .box li a h4{height: 46px; margin: 5px 3px 10px 3px; overflow: hidden; text-overflow: ellipsis; font-size: 16px; color: #333333;}
.main .wrap3 .box li a h5{float: left; color: #1d4970; font-size: 16px; margin: 5px 0 0 5px;}
.main .wrap3 .box li a h5 span{font-size: 30px; font-weight: 600; color: #1d4970;}
.main .wrap3 .box li a button{float: right; border: none; background-color: #ff8170; width: 120px; height: 40px; color: #FFFFFF; font-size: 22px; font-weight: 600;margin-right: 5px; cursor: pointer;}
.main .wrap3 .box li a p{position: absolute; top: 0; left: 0; background-color: #ff8170; color: #FFFFFF; height: 24px; line-height: 24px; text-align: center; padding: 0 5px;}
.main .wrap3 .box li a p span{color: white;}
.main .wrap3 .box li:hover{box-shadow: 0 1px 5px 1px rgba(0,0,0,0.2);}










